<template>
  <div>
    <el-breadcrumb separator="/">
      <el-breadcrumb-item :to="{ path: '/homw' }">首页</el-breadcrumb-item>
      <el-breadcrumb-item><a href="/">商品管理</a></el-breadcrumb-item>
      <el-breadcrumb-item>分类参数</el-breadcrumb-item>
    </el-breadcrumb>
    <el-alert :closable="false"
              title="警告提示的文案"
              type="warning" show-icon>
    </el-alert>
    <el-row class="cat_margin">
      <el-col :span="2" style="line-height: 40px">选择商品分类</el-col>
      <el-col :span="22">
        <el-cascader
          v-model="selectedKeys"
          :options="cateList"
          :props="cateOptions"
        ></el-cascader>
      </el-col>
    </el-row>
  </div>
</template>

<script>



  export default {
    created(){
     return this.getCateList();
    },
    data(){
      return {
        cateList:[],
        selectedKeys:[],
        cateOptions:{
          value: 'cat_id',
          label: 'cat_name',
          children:'children',
          expandTrigger: 'hover'
        }
      }
    },
    methods:{
     async getCateList(){
       const {data:res} = await this.$http.get(`categories`);
       if(res.meta.status!==200){return this.$message.error(res.meta.msg)}
       this.cateList = res.data
       console.log(this.cateList)
      }
    }
  }
</script>

<style lang="less" scoped>
  .cat_margin{
    margin-left: 15px;
    margin-top: 15px;
  }
</style>
